<template>
  <div>
    <div class="common_form_search">
      <el-form
        ref="searchForm"
        :inline="true"
        :model="searchForm"
      >
        <el-form-item label="代理商名称">
          <el-input
            v-model="searchForm.shopname"
            placeholder="请输入代理商名称"
            clearable
          />
        </el-form-item>
        <el-form-item label="账号">
          <el-input
            v-model="searchForm.account_num"
            placeholder="请输入账号"
            clearable
          />
        </el-form-item>
        <el-form-item label="状态">
          <el-select
            v-model="searchForm.status"
            placeholder="全部"
            clearable
          >
            <el-option
              label="已审核"
              :value="1"
            />
            <el-option
              label="待审核"
              :value="2"
            />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            size="small"
            type="primary"
            @click="search()"
          >查询</el-button>
          <el-button
            size="small"
            @click="reset()"
          >重置</el-button>
        </el-form-item>
      </el-form>
    </div>
    <el-divider />
    <div class="flex align-center table-top-btns">
      <h5 class="flex align-center">
        <svg-icon
          style="margin-right:15px"
          icon-class="list"
          :size="15"
        />数据列表
      </h5>
    </div>
    <el-table
      v-show="tableData.length > -1"
      :data="tableData"
      border
    >
      <el-table-column
        align="center"
        prop="id"
        label="ID"
        width="70"
      />
      <el-table-column
        align="center"
        prop="shopname"
        label="代理商名称"
      />
      <el-table-column
        align="center"
        prop="account_num"
        label="账号"
      />
      <el-table-column
        align="center"
        label="代理商头像"
      >
        <template slot-scope="scope">
          <el-image
            style="width:50px;height:50px"
            fit="fill"
            :src="$globalObj.imgBaseUrl+scope.row.photo"
          >
            <div
              slot="error"
              class="image-slot"
            >
              <i class="el-icon-picture-outline" />
            </div>
          </el-image>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop="people"
        label="联系人姓名"
      />
      <el-table-column
        align="center"
        prop="contact_tel"
        width="120"
        label="联系人手机号"
      />
      <el-table-column
        align="center"
        prop="category_name"
        label="经营项目"
      />
      <el-table-column
        align="center"
        prop="faptype_name"
        label="发票类型"
      />
      <el-table-column
        align="center"
        prop="status"
        label="审核状态"
      >
        <template slot-scope="scope">
          <el-tag :type="scope.row.status == 1 ? 'success' : scope.row.status == 2 ? 'warning' : 'danger'">{{ scope.row.status == 1 ? "已审核" : scope.row.status == 2 ? "待审核" : "拒绝" }}</el-tag>
        </template>
      </el-table-column>
<!--      <el-table-column-->
<!--          align="center"-->
<!--          label="关闭店铺/开启店铺"-->
<!--          width="240">-->
<!--        <template slot-scope="scope">-->
<!--          <template v-if="scope.row.close_shop == 1">-->
<!--            <el-button-->
<!--                size="mini"-->
<!--                @click="openShop(scope.row)"-->
<!--                type="primary">-->
<!--              开启-->
<!--            </el-button>-->
<!--          </template>-->
<!--          <template v-else>-->
<!--            <el-button-->
<!--                type="danger"-->
<!--                size="mini"-->
<!--                @click="closeShop(scope.row)">-->
<!--              关闭-->
<!--            </el-button>-->
<!--          </template>-->
<!--        </template>-->
<!--      </el-table-column>-->
<!--      <el-table-column-->
<!--          align="center"-->
<!--          label="限制单量"-->
<!--          width="200">-->
<!--        <template slot-scope="scope">-->
<!--          <template v-if="scope.row.close_shop == 0">-->
<!--            <el-button-->
<!--                size="mini"-->
<!--                @click="limitOrder(scope.row)"-->
<!--                type="primary">-->
<!--              设置单量({{scope.row.order_count}})-->
<!--            </el-button>-->
<!--          </template>-->
<!--        </template>-->
<!--      </el-table-column>-->
<!--      <el-table-column-->
<!--          align="center"-->
<!--          label="是否移交"-->
<!--          width="100">-->
<!--        <template slot-scope="scope">-->
<!--          <el-switch-->
<!--              :value="scope.row.is_handover"-->
<!--              active-color="#13ce66"-->
<!--              @change="switchWhetherHandOver(scope.row)"-->
<!--              :active-value="0"-->
<!--              :inactive-value="1"-->
<!--              inactive-color="#ff4949">-->
<!--          </el-switch>-->
<!--        </template>-->
<!--      </el-table-column>-->
<!--      <el-table-column-->
<!--        fixed="right"-->
<!--        align="center"-->
<!--        label="操作"-->
<!--        width="240"-->
<!--      >-->
<!--        <template slot-scope="scope">-->
<!--          <el-button-->
<!--            v-if="$hasMethod('#view')"-->
<!--            type="primary"-->
<!--            size="mini"-->
<!--            @click="$router.push({name: 'supplierView',params: { viewId: scope.row.id }})"-->
<!--          >查看</el-button>-->
<!--          <el-button-->
<!--            v-if="$hasMethod('#enable')"-->
<!--            :type="scope.row.endisable==1?'danger':'warning'"-->
<!--            size="mini"-->
<!--            @click="enable(scope.row.id, scope.row.endisable)"-->
<!--          >{{ scope.row.endisable == 1 ? "禁用" : "启用" }}</el-button>-->
<!--          <el-dropdown-->
<!--            v-if="$hasMethod('#edit')"-->
<!--            @command="command=>handleMore(command,scope.row)"-->
<!--          >-->
<!--            <span-->
<!--              class="el-dropdown-link blue-font pointer"-->
<!--              style="margin-left:10px"-->
<!--            >-->
<!--              更多操作<i class="el-icon-arrow-down el-icon&#45;&#45;right" />-->
<!--            </span>-->
<!--            <el-dropdown-menu slot="dropdown">-->
<!--              <el-dropdown-item-->
<!--                v-if="$hasMethod('#edit')"-->
<!--                command="edit"-->
<!--              >编辑资料</el-dropdown-item>-->
<!--              <el-dropdown-item-->
<!--                v-if="$hasMethod('#setWithdraw')"-->
<!--                command="setWithdraw"-->
<!--              >设置提现</el-dropdown-item>-->
<!--              <el-dropdown-item-->
<!--                v-if="$hasMethod('#onlinePay')"-->
<!--                command="onlinePay"-->
<!--              >线上支付</el-dropdown-item>-->
<!--              <el-dropdown-item-->
<!--                v-if="$hasMethod('#offlinePay')"-->
<!--                command="offlinePay"-->
<!--              >线下支付</el-dropdown-item>-->
<!--              <el-dropdown-item-->
<!--                v-if="$hasMethod('#contract')"-->
<!--                command="edit"-->
<!--              >发起合同</el-dropdown-item>-->
<!--              <el-dropdown-item-->
<!--                command="eqb"-->
<!--              >创建e签宝账户与签章</el-dropdown-item>-->
<!--            </el-dropdown-menu>-->
<!--          </el-dropdown>-->
<!--        </template>-->
<!--      </el-table-column>-->
    </el-table>
    <custom-page
      ref="customPage"
      :total="total"
      @getList="getList"
    />
    <el-dialog title="设置每天单量" :visible.sync="dialogFormRoll" width="500px">
      <el-form style="text-align: center">
        <el-input type='text' v-model="orderCount" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" style="width: 100px;">
        </el-input>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormRoll = false">取 消</el-button>
        <el-button type="primary" @click="enter1">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { createEQB } from '@/api/audit'
import {
  getMerchantList,
  editSupplier,
  closeShopUser,
  openShopUser,
  limitQuantity,
  whetherHandOver,
} from '@/api/merchant'
import customPage from '@/components/customPage'
export default {
  components: { customPage },
  props: ['shopname'],
  data() {
    return {
      searchForm: {
        shopname: '',
        account_num: '',
        status: null
      },
      total: 0,
      tableData: [],
      routerName: '',
      dialogFormRoll:false,
      orderCount:''
    }
  },
  created() {
    // console.log('shopname1',this.$route.query.shopname)
    if (this.$route.query.shopname) {
      this.routerName = this.$route.query.shopname
    }
  },
  mounted() {
    this.getList()
  },
  // computed: {
  //   shopname(){
  //     console.log('shopname1',this.$route.query.shopname)
  //   }
  // },
  methods: {
    handleMore(command, item) {
      console.log(command, item)
      // this.selectedItem = item;
      if (command == 'edit') {
        // 编辑资料
        this.$router.push({ name: 'supplierView', params: { viewId: item.id, toEdit: true }})
      } else if (command == 'eqb') {
        createEQB(item.id).then(res => {
          // debugger
        })
      }
    },
    switchWhetherHandOver({id,is_handover}){
      whetherHandOver({userId:id,is_handover:is_handover === 1 ? 0 : 1}).then((res)=>{
        this.$message.success('操作成功');
        this.getList(true);
      })
    },
    enter1(){
      limitQuantity({memberId:this.memberId,orderCount:this.orderCount}).then(res=>{
        if (res){
          this.dialogFormRoll=false;
          this.$message.success('设置成功');
          this.orderCount='';
          this.getList(true);
        }else {
          this.$message.success('设置失败');
          this.dialogFormRoll=false;
          this.getList(true);
        }
      })

    },
    // 查询
    search() {
      this.$refs.customPage.page = 1
      this.getList()
    },
    // 重置
    reset() {
      this.searchForm = {
        shopname: '',
        account_num: '',
        status: null
      }
      this.routerName = ''
      this.getList()
    },
    // 启用/禁用
    enable(id, endisable) {
      editSupplier({
        id,
        endisable: endisable == 1 ? 2 : 1
      }).then(res => {
        this.getList(true)
      })
    },
    closeShop(row){
      // console.log(row);
      closeShopUser({userId:row.id}).then(res=>{
        // console.log(res);
        this.$message.success('关闭成功');
        this.getList(true);
      })

    },
    openShop(row){
      openShopUser({userId:row.id}).then(res=>{
        // console.log(res);
        this.$message.success('开启成功');
        this.getList(true);
      })
    },
    //限制单量
    limitOrder(row){
      this.dialogFormRoll=true;
      this.memberId=row.id;
      this.orderCount=row.order_count;
    },
    getList(flag) {
      // flag为true, 则不刷新表格
      const { page, pageSize } = this.$refs.customPage
      if (!flag) {
        this.tableData = []
      }
      this.searchForm.shopname = this.searchForm.shopname || this.routerName
      getMerchantList({ page, pageSize, ...this.searchForm }).then(res => {
        this.tableData = res.data || []
        this.total = res.total
      })
    }
  },
  beforeRouteEnter(to, from, next) {
    if (from.name === 'supplierView') {
      next(vm => {
        vm.getList()
      })
    } else {
      next()
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
